<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>首页--layui后台管理模板 2.0</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/css/public.css" media="all" />
	<style>
		.history_box {
			overflow: hidden;
		}
		#scene-chart {
			margin-top: 0px !important;
		}
	</style>
</head>
<body class="childrenBody">
	<blockquote class="layui-elem-quote layui-bg-green">
		<div id="nowTime"></div>
	</blockquote>


	<div class="layui-row layui-col-space10">

		<div class="layui-col-lg8 layui-col-md12">
			<blockquote class="layui-elem-quote title">实验室设备/物品借用次数统计</blockquote>
			<div id="echart-box" class="layui-elem-quote layui-quote-nm  magb0" style="height: 594px;width: 1093px">
				<div id="scene-chart" style="margin-top:10px;height: 100%;width: 100%;">
					<div id="container" style="height: 100%"></div>
					<script type="text/javascript" src="/admin/js/Echarts/echarts.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/echarts-gl.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/ecStat.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/dataTool.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/simplex.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/bmap.min.js"></script>
					<%--<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>--%>
					<script src="/js/common/jquery-3.3.1.js"></script>
					<script src="/js/common/jquery.cookie.js"></script>
					<script type="text/javascript">
						var dom = document.getElementById("container");
						var myChart = echarts.init(dom);
						var app = {};
						var date;
						var count;
						$.ajax({
							url: "/admin/productUsed/getRecentDate",
							type: "GET",
							async:false,
							success: function (data) {//['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
								date=data
							}
						})
						$.ajax({
							url: "/admin/productUsed/getRecentData",//单点登录链接
							type: "GET",
							async:false,
							success: function (data) {
								count=data;
							}
						})
						option = null;
						option = {
							xAxis: {
								type: 'category',
								boundaryGap: false,
								data:date
							},
							yAxis: {
								type: 'value'
							},
							series: [{
								data: count,

								type: 'line',
								areaStyle: {}
							}]
							,color:['#94dfff']
						};
						;
						if (option && typeof option === "object") {
							myChart.setOption(option, true);
						}
					</script>
				</div>
			</div>
		</div>

		<div class="layui-col-lg4 layui-col-md12">
			<blockquote class="layui-elem-quote title">物品数量占比 <i class="layui-icon layui-red">&#xe756;</i></blockquote>
			<div id="echart-box3" class="layui-elem-quote layui-quote-nm magb0 " style="height: 220px;width: 520px">
				<div id="scene-chart3" style="height: 100%;width: 100%;">
					<div id="container3" style="height: 100%"></div>
					<script type="text/javascript" src="/admin/js/Echarts/echarts.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/echarts-gl.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/ecStat.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/dataTool.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/simplex.js"></script>
					<%--<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
					<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>--%>
					<script type="text/javascript">
						var dom = document.getElementById("container3");
						var myChart = echarts.init(dom);
						var app = {};
						var d;
						$.ajax({
							url: "/admin/product/getPropCount",
							type: "GET",
							async:false,
							success: function (data) {

								d=data
							}
						})
						var arr = []
						d.forEach(function(value,i){
							arr[i]=value.name;
						})
						option = null;
						option = {
							title : {
								text: '数量统计',
								subtext: '',
								x:'center'
							},
							tooltip : {
								trigger: 'item',
								formatter: "{a} <br/>{b} : {c} ({d}%)"
							},
							legend: {
								orient: 'vertical',
								left: 'left',
								data: arr//['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
							},
							series : [
								{
									name: '物品数量',
									type: 'pie',
									radius : '55%',
									center: ['50%', '60%'],
									data:d,
									itemStyle: {
										emphasis: {
											shadowBlur: 10,
											shadowOffsetX: 0,
											shadowColor: 'rgba(0, 0, 0, 0.5)'
										}
									}
								}
							]
						};
						;
						if (option && typeof option === "object") {
							myChart.setOption(option, true);
						}
					</script>
				</div>
			</div>
			<%--<table class="layui-table mag0" lay-skin="line">
				<colgroup>
					<col>
					<col width="110">
				</colgroup>
				<tbody class="hot_news"></tbody>
			</table>--%>
		</div>
		<div class="layui-col-lg4 layui-col-md12">
			<blockquote class="layui-elem-quote title">近六月支出统计</blockquote>
			<div id="echart-box2" class="layui-elem-quote layui-quote-nm magb0 " style="height: 290px;width: 520px">
				<div id="scene-chart2" style="height: 100%;width: 100%;">
					<div id="container2" style="height: 100%"></div>

					<script type="text/javascript" src="/admin/js/Echarts/echarts.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/echarts-gl.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/ecStat.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/dataTool.min.js"></script>
					<script type="text/javascript" src="/admin/js/Echarts/simplex.js"></script>
					<script type="text/javascript">
						var dom = document.getElementById("container2");
						var myChart = echarts.init(dom);
						var app = {};
						var d;
						$.ajax({
							url: "/admin/travelBusiness/comsumption",
							type: "GET",
							async:false,
							success: function (data) {

								d=data
							}
						})
						var arr = []
						d.forEach(function(value,i){
							arr[i]=value.name;
						})
						option = null;
						option = {
							title : {
								text: '支出统计',
								subtext: '',
								x:'center'
							},
							tooltip : {
								trigger: 'item',
								formatter: "{a} <br/>{b} : {c} ({d}%)"
							},
							legend: {
								orient: 'vertical',
								left: 'left',
								data: arr//['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
							},
							series : [
								{
									name: '当月支出',
									type: 'pie',
									radius : '55%',
									center: ['50%', '60%'],
									data:d,
									itemStyle: {
										emphasis: {
											shadowBlur: 10,
											shadowOffsetX: 0,
											shadowColor: 'rgba(0, 0, 0, 0.5)'
										}
									}
								}
							]
						};
						;
						if (option && typeof option === "object") {
							myChart.setOption(option, true);
						}
					</script>
				</div>
			</div>

		</div>
	</div>

	<script type="text/javascript" src="/layui/layui.js"></script>

	<script src="/js/common/jquery-3.3.1.js"></script>
	<script src="/js/common/jquery.cookie.js"></script>
	<script type="text/javascript" src="/js/main.js"></script>
</body>
</html>